// 引入CountUI组件
import CountUI from '../../components/Count'
// 引入connect用于连接UI组件与redux
import { connect } from 'react-redux'
// 引入action
import { createIncrementAction, createDecrementAction, createIncrementAsyncAction } from '../../redux/countAction'

/**
 * 1.mapStateToProps函数返回的一个对象
 * 2.返回的对象中的key就作为传递给UI组件props的Key，value就作为传递给UI组件props的value
 * 3.mapStateToProps函数用于传递状态
 * @param {*} state
 * @returns
 */
function mapStateToProps(state) {
  return { count: state }
}

/**
 * 1.mapDispatchToProps函数返回的一个对象
 * 2.返回的对象中的key就作为传递给UI组件props的Key，value就作为传递给UI组件props的value
 * 3.mapDispatchToProps函数用于传递操作状态的方法
 *  @param {*} dispatch
 * @returns
 */
function mapDispatchToProps(dispatch) {
  return {
    jia: (number) => dispatch(createIncrementAction(number)),
    jian: (number) => dispatch(createDecrementAction(number)),
    jiaAsync: (number, time) => dispatch(createIncrementAsyncAction(number, time))
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(CountUI)
